/*
 * @Author: xuchao 
 * @Date: 2018-05-16 14:10:53 
 * @Last Modified by: xuchao
 * @Last Modified time: 2018-06-11 09:48:09
 */
import React, { Component } from 'react';
import { Layout } from 'antd';
import './style.less';

export default class RecordCompany extends Component {
    constructor(props){
        super(props)
        this.state = {
            list: [{
                name: '益海（连云港）粮油工业有限公司',
                time: '2018-06-08',
                term: 4,
                state: true
            }, {
                name: '江苏恒瑞医药股份有限公司',
                time: '2018-05-28',
                term: 4,
                state: true
            }, {
                name: '江苏君臣实业集团有限公司',
                time: '2018-05-19',
                term: 4,
                state: true
            }, {
                name: '江苏康缘药业股份有限公司',
                time: '2018-05-16',
                term: 4,
                state: true
            }, {
                name: '连云港康达智精密技术有限公司',
                time: '2018-05-14',
                term: 4,
                state: true
            }, {
                name: '大陆汽车电子（连云港）有限公司',
                time: '2018-05-11',
                term: 4,
                state: true
            }, {
                name: '连云港正大天晴医药有限公司',
                time: '2018-05-07',
                term: 4,
                state: true
            }, {
                name: '江苏方洋集团有限公司',
                time: '2018-05-01',
                term: 4,
                state: true
            }, {
                name: '东海万花山诚信物流',
                time: '2018-04-29',
                term: 4,
                state: true
            }, {
                name: '江苏乾多多投资有限公司',
                time: '2018-04-24',
                term: 4,
                state: true
            }, {
                name: '连云港启创铝制品制造有限公司',
                time: '2018-04-22',
                term: 4,
                state: true
            }, {
                name: '东海仁慈医院',
                time: '2018-04-18',
                term: 4,
                state: true
            }, {
                name: '太阳雨集团有限公司',
                time: '2018-04-13',
                term: 4,
                state: true
            }]
        }
    }

    render() {
        const { list } = this.state;
        return (
            <Layout.Content className="recordCompany">
                <div className="banner animated fadeIn">
                    <h1>等保测评备案单位</h1>
                </div> 
                <div className="center">
                    <div className="search">
                        <input type="text" placeholder="请输入资质或单位名称" />
                        <i />
                    </div>
                    <ul>
                        <li className="title">
                            <span>单位名称</span>
                            <span>备案时间</span>
                            <span>备案有效期</span>
                            <span>当前状态</span>
                        </li>
                        {
                            list && list.map((item, index) => {
                                return(
                                    <li key={index}>
                                        <span>{item.name}</span>
                                        <span>{item.time}</span>
                                        <span>{item.term}年</span>
                                        <span>{item.state ? '有效' : '无效'}</span>
                                    </li>  
                                )
                            })
                        }
                        
                    </ul>
                </div>
            </Layout.Content>
        );
    }
}